<eda-dialog [inject]="dialog">
  <div body>

    <div class="grid">

      <div class="col-12">

        <div style="margin: 1em;">
          <p-radioButton name="groupname" value="users" [label]="usersLabel" [(ngModel)]="type"
            (onClick)="resetValues()">
          </p-radioButton>
        </div>
        <div style="margin: 1em;">
          <p-radioButton name="groupname" value="groups" [label]="groupsLabel" [(ngModel)]="type"
            (onClick)="resetValues()"></p-radioButton>
        </div>
      </div>

      <!-- USERS -->

      <div *ngIf="type==='users'" class="col-12">
        <p-multiSelect [options]="users" [(ngModel)]="selectedUsers" [virtualScroll]="true" itemSize="30"
          [style]="{'vertical-align' : 'bottom', 'margin-left' : '15px', width: '60%' }"
          [panelStyle]="{minWidth:'15em'}" maxSelectedLabels="1" [defaultLabel]="usersDefaultLabel">
        </p-multiSelect>
      </div>

      <!-- GROUPS -->
      <div *ngIf="type==='groups'" class="col-12">
        <p-multiSelect [options]="roles" [(ngModel)]="selectedRoles" [virtualScroll]="true" itemSize="30"
          [style]="{'vertical-align' : 'bottom', 'margin-left' : '15px', width: '60%' }"
          [panelStyle]="{minWidth:'15em'}" maxSelectedLabels="1" [defaultLabel]="groupsDefaultLabel">
        </p-multiSelect>
      </div>



      <!-- COMMON -->

      <div style="margin-left: 1em;" *ngIf="type" class="col-12">
        <div i18n="@@tablePermissionNO" *ngIf="!permission">No tiene permiso para ver esta tabla</div>
        <div i18n="@@tablePpermissionYES" *ngIf="permission">SI tiene permiso para ver esta tabla</div>
        <p-inputSwitch [(ngModel)]="permission"></p-inputSwitch>
      </div>
    </div>

  </div>

  <div footer>

    <div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix text-right">
      <button type="button" pButton (click)="savePermission()"
        [disabled]="(selectedUsers.length < 1 && selectedRoles.length < 1) "
        class="ui-button" icon="fa fa-check" i18n-label="@@guardarBtn" label="Confirmar"
        id="eda_column_permission_confirmar"></button>
      <button type="button" pButton (click)="closeDialog()" class="p-button-raised p-button-danger" i18n-label="@@cerrarBtn"
        label="Cerrar"></button>
    </div>


  </div>
</eda-dialog>
